<script type="text/html" id="user_toolbar">
    @{{ if .canEdit }}
        <a class="custom-edit" lay-event="edit">编辑</a>
    @{{ end }}
    @{{ if .canFreeze }}
        {{# if(d.Status == "1"){ }}
            <a class="custom-freeze" lay-event="freeze">禁用</a>
        {{#  } else { }}
            <a class="custom-unfreeze" lay-event="unfreeze">启用</a>
        {{#  } }}
    @{{ end }}
    @{{ if .canDelete }}
        <a class="custom-delete" lay-event="del">删除</a>
    @{{ end }}
</script>

<script>
    layui.config({
        base: '/static/customAdmin/'
    }).extend({
        index: 'lib/index'
    }).use(['index', 'table', 'admin', 'form'], function () {
        const table = layui.table,
            admin = layui.admin,
            form = layui.form,
            $ = layui.$;

        table.render({
            elem: '#user_lists'
            , autoSort: false
            , skin: 'line'
            , method: 'post'
            , where: {
                order:'desc',
                sort:'CreatedAt'
            }
            ,contentType:'application/json'
            , url: @{{ urlfor "BackendUserController.DataGrid" }}
            , request: {
                pageName: 'offset' //页码的参数名称，默认：page
                , limitName: 'limit' //每页数据量的参数名，默认：limit
            },response:{
                statusName : 'code',
                statusCode : 0,
            }
            , parseData: function (res) {
                return {
                    "code": res.code,
                    "count": res.total,
                    "data": res.rows
                };
            }
            , cols: [[
                {field: 'RealName', title: '真实姓名', sort: true, style: 'color: rgb(27, 135, 255);'}
                ,{field: 'UserName', title: '用户名', sort: true, style: 'color: rgb(27, 135, 255);'}
                , {field: 'Email', title: '邮箱', sort: true}
                , {field: 'RoleId', title: '角色', templet: function (data) {
                        return `<span>${data.RoleNames}</span>`
                    }
                }
                , {field: 'Mobile', title: '手机', sort: true}
                , {field: 'Status', title: '状态', sort: true, templet: function (data) {
                        return data.Status ? `<span class="green">正常</span>` : `<span class="red">禁用</span>`
                    }
                }
                , {field: 'CreatedAt', title: '创建时间', sort: true}
                , {title: '操作', toolbar: '#user_toolbar', width: 250}
            ]]
            , page: true
            , limit: 10
        });

        table.on('sort(user_lists)', function (obj) {
            table.reload('user_lists', {
                initSort: obj
                , where: {
                    orderBy: obj.field
                    , sortedBy: obj.type
                }
            });
        });

        $("#user_search").on('keydown', function (e) {
            let eCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
            if (eCode === 13) {
                table.reload('user_lists', {
                    where: {
                        UserNameLike: $(this).val(),
                    },
                    page: {
                        curr: 1
                    }
                });
            }
        });

        form.on('select(status)', function (data) {
            table.reload('user_lists', {
                where: {
                    SearchStatus: data.value ? data.value : ''
                }
            });
        });

        table.on('tool(user_lists)', function (obj) {
            const data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除么', {title: '提示'}, async (index) => {
                    await admin.delete(`/backenduser/delete/${data.Id}`);
                    layer.close(index);
                    table.reload('user_lists');
                });
            } else if (obj.event === 'edit') {
                const topLayui = parent === self ? layui : top.layui
                    , href = `/backenduser/edit/${data.Id}`
                    , text = `编辑账号：${data.RealName}`;
                topLayui.index.openTabsPage(href, text);
            } else if (obj.event === 'freeze') {
                layer.confirm('真的禁用么？', {title: '提示'}, async (index) => {
                    await admin.get(`/backenduser/freeze/${data.Id}`,true);
                    layer.close(index);
                    table.reload('user_lists');
                });
            } else if (obj.event === 'unfreeze') {
                layer.confirm('真的启用么？', {title: '提示'}, async (index) => {
                    await admin.get(`/backenduser/freeze/${data.Id}`,true);
                    layer.close(index);
                    table.reload('user_lists');
                });
            }
        });

    });
</script>